<!--
 * @Description: 
 * @Author: lwx
 * @Date: 2022-12-01 14:57:10
 * @LastEditors: lwx
 * @LastEditTime: 2023-04-21 14:27:13
-->
<template>
    <div class="line-chart">
      <!-- y轴 -->
       <div class="ml-3">
         <span class="mr-2">Y轴</span>
         <el-input v-model="params.y_min" size="mini" class="inputWidth"></el-input> -
         <el-input v-model="params.y_max" size="mini" class="inputWidth"></el-input> -
         <el-select v-model="params.y_unit" size="mini" class="selectWidth" @change="changeParams">
           <el-option 
             v-for="(item,index) in params.y_select"
             :key="index"
             :label="item" 
             :value="item">
           </el-option>
         </el-select>
       </div>
       <!-- 折线图 -->
       <params-chart :cdata="params"  style="height:270px"/>
       <!-- x轴 堆叠或测漏 -->
       <div class="ml-3">
         <span class="mr-2">x轴</span>
         <el-date-picker 
           v-model="params.x_min" 
           size="mini" 
           type="datetime"
           style="width:170px"
           format="yyyy-MM-dd HH:mm:ss">
         </el-date-picker> -
         <el-date-picker 
           v-model="params.x_max" 
           size="mini" 
           type="datetime"
           style="width:170px"
           format="yyyy-MM-dd HH:mm:ss"> 
         </el-date-picker> -
         <el-select v-model="params.x_unit" size="mini" style="width:70px">
           <el-option label="时间" value="时间"></el-option>
         </el-select>
       </div>
     </div>
</template>

<script>
import paramsChart from '@/components/echart/paramsChart'
export default {
  components:{
    paramsChart,
  },
  props:{
    params:Object
  },
  data () {
    return {
     
    }
  },
  methods:{
    changeParams(val){
     this.$emit('changeParams',val)
    }
  }
}
</script>
<style lang='scss' scoped>
.line-chart{
  font-size: 13px;
}
.inputWidth{
  width: 60px;
}
.selectWidth{
    width:175px
}
/deep/.el-input--suffix .el-input__inner{
  padding-right: 0;
}
</style>